<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>APP</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
</head>
<style type="text/css">
body { background: #f7f9f8;}
/*重新定义*/
.aui-list-view { border-radius: 6px;}
.aui-list-view:after { border-top: 0;}
.aui-list-view:before { border-top: 0;}
.aui-grid-sixteen li .aui-iconfont {
    background: #ff9900;
    color: #ffffff;
    width: 38px;
    height: 38px;
    line-height: 38px;
    border-radius: 50%;
    font-size: 20px;
}
/*自定义*/
.icons { margin-top: 15px;}
.image img { width: 100%}
p { font-size: 12px; margin-bottom: 5px;}
.content { font-size: 12px;}
.aui-iconfont {
    color: #ffffff;
}
</style>
<body>
    <div class="aui-content-padded icons">
        <ul class="aui-grid-sixteen">
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-my"></span>
                <p>评测分享</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-emoji"></span>
                <p>花粉随拍</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-pic"></span>
                <p>有点不同</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-service"></span>
                <p>爱机达人</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-service"></span>
                <p>生活趣事</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-like"></span>
                <p>主题DIY</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-home"></span>
                <p>经典手游</p>
            </li>
            <li class="aui-col-xs-3 aui-text-center">
                <span class="aui-iconfont aui-icon-mark"></span>
                <p>你问我答</p>
            </li>
        </ul>
    </div>
    <div class="aui-content-padded">
        <ul>
            <li class="aui-list-view">
                <div class="aui-col-xs-12 aui-padded-5">［评测分享］最美蓝牙耳机－荣耀小口哨</div>
                <div class="aui-col-xs-12 image">
                    <img src="../image/ad1.jpg">
                </div>
                <div class="aui-col-xs-12 aui-ellipsis-2 aui-padded-5 content">
                    今年6月30日，在备受瞩目的2015荣耀新品发布会上，除了发布大家期待已久的荣耀新旗舰－－荣耀7之外，还发布了最美蓝牙耳机－－荣耀小口哨
                </div>
                <p class="aui-padded-5">
                    <span class="aui-pull-left">流浪男  2015/7/16 20:00</span>
                    <span class="aui-pull-right">118</span>
                </p>
            </li>
            <li class="aui-list-view">
                <div class="aui-col-xs-12 aui-padded-5">［花粉随拍］恬静的小溪</div>
                <div class="aui-col-xs-12 image">
                    <img src="../image/ad2.jpg">
                </div>
                <div class="aui-col-xs-12 aui-ellipsis-2 aui-padded-5 content">
                    等到风景都看透，也许、你、会陪着我看细水长流倾听消息浅唱、丝绸般透着亮，泛着光。淡定从容，从大石两侧穿过
                </div>
                <p class="aui-padded-5">
                    <span class="aui-pull-left">流浪男  2015/7/16 20:00</span>
                    <span class="aui-pull-right">118</span>
                </p>
            </li>
            <li class="aui-list-view">
                <div class="aui-col-xs-12 aui-padded-5">［有点不同］荣耀7线下首销火爆四城</div>
                <div class="aui-col-xs-12 image">
                    <img src="../image/ad3.jpg">
                </div>
                <div class="aui-col-xs-12 aui-ellipsis-2 aui-padded-5 content">
                    2015年7月11日，因为荣耀7注定是一个有点不同的日子！因为荣耀7全国线下首销活动在北京、南京、郑州和成都四大城市
                </div>
                <p class="aui-padded-5">
                    <span class="aui-pull-left">流浪男  2015/7/16 20:00</span>
                    <span class="aui-pull-right">118</span>
                </p>
            </li>
        </ul>
    </div>
</body>
<script type="text/javascript" src="../script/api.js" ></script>
<script type="text/javascript">
    apiready = function () {
    }
</script>
</html>